<template>
  <div class="page_padding">
    <MyNavBar @goback="goback" title="任务列表" />
    <!-- 头部筛选 开始 -->
    <task-head @search="onSearchChange"></task-head>
    <!-- 头部筛选 结束 -->
    <!-- 列表 开始 -->
    <div class="task-list">
      <van-list
        v-model="loading"
        :finished="finished"
        finished-text="没有更多了"
        @load="initData"
        v-if="list.length > 0">
        <list-item v-for="(item, index) in list" :key="index" :task-item="item" @itemClick="onItemClick"></list-item>
      </van-list>
      <van-empty description="暂无数据" v-else />
    </div>
    <!-- 列表 结束 -->
  </div>
</template>
<script>
import { listTaskInfos } from '@api/api-task.js'
import ListItem from './list/ListItem.vue'
import TaskHead from './list/TaskHead.vue'
export default {
  name: 'TaskManage',
  components: { ListItem, TaskHead },
  props: {},
  data() {
    return {
      list: [],
      searchParam: {
        page: { current: 1, size: 10 },
      },
      total: 0,
      loading: false,
      finished: false,
    }
  },
  computed: {},
  watch: {},
  activated() {
    /* 判断是否有缓存的查询参数 */
    if (this.getSearchPar) {
      const { key = '', objId = '', child = {} } = this.getSearchPar
      this.searchParam[key] = objId
      if (child) {
        this.searchParam[child.key] = child.objId
      }
    }
    this.searchParam.page.current = 1
    this.initData()
  },
  created() {},
  mounted() {
    // this.initData()
  },
  methods: {
    /* 监听筛选条件变化 */
    onSearchChange(obj) {
      this.searchParam = { ...this.searchParam, ...obj }

      this.searchParam.page.current = 1
      this.initData()
    },
    /* 查询列表数据 */
    async initData() {
      const { data = {} } = await listTaskInfos({ ...this.searchParam })
      const { records = [], total = 0 } = data
      if (this.searchParam.page.current === 1) {
        this.list = records
      } else {
        this.list.push(...records)
      }

      this.searchParam.page.current++
      this.total = total
      this.loading = false
      if (this.list.length === this.total) {
        this.finished = true
      }
    },
    /* 点击跳转详情 */
    onItemClick({ id = '' }) {
      this.$router.push({
        path: '/task/detail',
        query: {
          id: id,
          // activeTabsName: activeTabsName,
        },
      })
    },
    /* 返回上一页 */
    goback() {
      this.$router.go(-1)
    },
  },
}
</script>
<style lang="scss" scoped></style>
